//@baseUrl: '../assets/images/';
// 盒子宽和高
.size(@w, @h) { width: @w; height: @h; }

// 字体大小
.fz(@fz) { font-size: @fz; }
// 字体大小与行高
.fz(@fz, @lh) { font-size: @fz; line-height: @lh; }
// 文字粗细
.fw(@fw: bold) { font-weight: @fw; }
// 行高
.lh(@h) { line-height: @h;}

// 字体颜色, 包括链接与非链接
.color(@color) { color: @color;}

.border-1px {
  position: relative;
  &::before {
    position: absolute;
    content: '';
    display: block;
    @media only screen and (-webkit-device-pixel-ratio: 2) {
      transform: scaleY(.5);
    }
    @media only screen and (-webkit-device-pixel-ratio: 3) {
      transform: scaleY(.33333333333);
    }
  }
}

// 1px 边框
.border-1px(top, @color: black) {
  &:extend(.border-1px all);
  &::before {
    width: 100%;
    height: 1px;
    top: 0;
    background: @color;
  }
}
.border-1px(bottom, @color: black) {
  &:extend(.border-1px all);
  &::before {
    width: 100%;
    height: 1px;
    bottom: 0;
    background: @color;
  }
}
.border-1px(left, @color: black) {
  &:extend(.border-1px all);
  &::before {
    width: 1px;
    height: 100%;
    left: 0;
    background: @color;
  }
}
.border-1px(right, @color: black) {
  &:extend(.border-1px all);
  &::before {
    width: 1px;
    height: 100%;
    right: 0;
    background: @color;
  }
}

.bg(@argument) { background: @argument; }
//.bgi(@url) { background: url(@url) no-repeat; }
.bgs(@w, @h) { background-size: @w @h; }
.bgp(@x, @y) { background-position: @x @y; }

// 统一盒模型
.border-box() {
  /**, *:after, *:before { */
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

// 文字图片居中
.center(text-x) { text-align: center; }
// 块级元素水平居中
.center(auto-x) { display: block; margin-left: auto; margin-right: auto; }

// 浮动, 兼容 IE6
//  *display: inline; _display:inline;
.fl() { float: left; }
.fr() { float: right; }

// 清除浮动
.clearFix {
  *zoom: 1;
  &:after { display: block; clear: both; content: ''; visibility: hidden; height: 0; }
}

.overflow(@h) {
  overflow: @h;
}
// 禁止换行, 文本溢出省略号显示 (一行
.ellipsis() {
  white-space: normal; word-wrap: break-word; word-break: break-all;
  -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; text-overflow:ellipsis; overflow:hidden;
}
// 文本溢出省略号显示 (多行)
// 只支持 webkit 浏览器, 解决方案：高度 = 行高*行数
// height: 90px; line-height: 30px; -webkit-line-clamp: 3;
.ellipsis-mult(@n: 3) {
  display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: @n; word-break: break-all;
  -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; text-overflow:ellipsis; overflow: hidden;
}
